<template>
  <div class="me1">
   <headerNav>
         <div class="me">我的</div>
         <img src="http://file.rzkeji.com/web/loveciy/img/tabBar/circle.png" class="rightImg"/>
   </headerNav>
    
   <div class="me_header">
     <div class="header_image">
       <img src="http://file.rzkeji.com/web/loveciy/img/tabBar/circle.png"/>
       <div class="header_title">请登陆</div>
     </div>
   </div>

   <ul>
     <li>
       <img src="http://file.rzkeji.com/web/loveciy/img/tabBar/circle.png"/>
       <div>认证中心</div>
       <div>></div>
     </li>
   </ul>

   <ul>
     <li>
       <img src="http://file.rzkeji.com/web/loveciy/img/tabBar/circle.png"/>
       <div>认证中心</div>
       <div>></div>
     </li>
     <li>
       <img src="http://file.rzkeji.com/web/loveciy/img/tabBar/circle.png"/>
       <div>认证中心</div>
       <div>></div>
     </li>
     <li>
       <img src="http://file.rzkeji.com/web/loveciy/img/tabBar/circle.png"/>
       <div>认证中心</div>
       <div>></div>
     </li>
     <li>
       <img src="http://file.rzkeji.com/web/loveciy/img/tabBar/circle.png"/>
       <div>认证中心</div>
       <div>></div>
     </li>
   </ul>

   <ul>
     <li>
       <img src="http://file.rzkeji.com/web/loveciy/img/tabBar/circle.png"/>
       <div>认证中心</div>
       <div>></div>
     </li>
     <li>
       <img src="http://file.rzkeji.com/web/loveciy/img/tabBar/circle.png"/>
       <div>认证中心</div>
       <div>></div>
     </li>
   </ul>
    <div class="phone">客服电话:37409589</div>
   <footerNav></footerNav>
  </div>
</template>

<script>
import footerNav from '@/components/footer_nav'
import headerNav from '@/components/header_nav'
export default {
  name: 'me',
  components:{
    headerNav,
    footerNav
  },
  data () {
    return {
    }
  },
  mounted(){
  },
  methods:{
  }
}
</script>
<style scoped>
.me1{width: 100%;height: 100%;background-color: #f0f0f0}
.me1 div.me{width: 100%;height: 100%;line-height: 50px;text-align: center;font-size: 18px;color: #fff;background-image: linear-gradient(-180deg,#3583f1,#1862E2);border-bottom: 1px solid #3583f1;}
.me_header{width: 100%;height: 112px;display: flex;position: relative;background-image: -webkit-
  linear-gradient(top,#3583f1,#1862e4);background-image: linear-gradient(-180deg,#3583f1,#1862e4);}
.header_image{width: 200px;height: 100%;}
.header_image img{width: 72px;height: 72px;float: left;margin-top: 20px;margin-left: 20px;margin-right: 10px;}
.header_image div{float: left;font-size: 18px;color: #fff;margin-top: 37px;}
ul {margin-top: 10px;}
ul li{width: 100%;height: 48px;background-color: #fff;display: flex;justify-content: row;position: relative;}
ul li img{width: 20px;height: 20px;margin-top: 14px;margin-left: 10px;margin-right: 10px;}
ul li div{height: 48px;line-height: 48px;word-wrap: break-word;
    word-break: break-all;font-size: 18px;}
ul li div:nth-of-type(1){font-size: 17px;}
ul li div:nth-of-type(2){position: absolute;right: 10px;color: #c8c8cd;}
.phone{text-align: center;width: 100%;color: #9b9b9b;font-size: 12px;padding: 20px 0;}
</style>
